<template>
<div>
    <button @click="butx()">我要导出数据</button>
  <el-table
    :data="tableData"
    stripe
    style="width: 100%;"
      height="500">
    <el-table-column
      prop="room"
      label="课室"
      width="180"
      show-overflow-tooltip>
    </el-table-column>
    <el-table-column
      prop="xz"
      label="课程类型"
      width="180">
    </el-table-column>
    <el-table-column
      prop="c_number"
      label="编号"
       width="180">
    </el-table-column>
     <el-table-column
      prop="c_number"
      label="编号"
       width="180">
    </el-table-column>
     <el-table-column
      prop="c_name"
      label="课程名称"
       width="180">
    </el-table-column>
     <el-table-column
      prop="c_type"
      label="专业类型"
       width="180">
    </el-table-column>
     <el-table-column
      prop="c_totaltime"
      label="学时"
       width="180">
    </el-table-column>
    <el-table-column
      prop="c_teacher"
      label="教师姓名"
       width="180">
    </el-table-column>
    <el-table-column
      prop="c_grade"
      label="年级"
       width="180">
    </el-table-column>
     <el-table-column
      prop="c_classroom"
      label="班级"
       width="180">
    </el-table-column>
     <el-table-column
      prop="student_number"
      label="学生人数"
       width="180">
    </el-table-column>
     <el-table-column
      prop="c_date"
      label="开始时间"
       width="180">
    </el-table-column>
    
    <el-table-column
      prop="c_time"
      label="结束时间"
       width="180">
       
    </el-table-column>
    <el-table-column
      prop="c_state"
      label="状态"
       width="180">
       
    </el-table-column>

     <el-table-column
      prop="tpicture"
      label="签名图片"
       width="180">
              <template slot-scope="scope"><!--slot--->
                    <img :src="scope.row.tpicture" style="width: 90px;height: 50px"  alt="image">
                </template>     
    </el-table-column>
    
    
  </el-table>

</div>

</template>

<script>
import { axios1 } from '@/network'//网络封装
import table2excel from 'js-table2excel'

const column = [
    {
      title: '课室', 
      key: 'room',
      type: 'text'
    },
    {
      title: '课程类型',
      key: 'xz',
      //type: 'image',
      //width: 100,
      //height: 100
      type:'text'
    },{
      title:'课程编号',
      key:'c_number',
      type:'text'
    },
    {
        title:'课程性质',
        key:'c_type',
        type:'text'
    },
     {
        title:'学时',
        key:'c_totaltime',
        type:'text'
    },
    {
        title:'教师姓名',
        key:'c_teacher',
        type:'text'
    },
    {
        title:'年级',
        key:'c_grade',
        type:'text'
    },
    {
        title:'班级',
        key:'c_classroom',
        type:'text'
    },
    {
        title:'学生人数',
        key:'student_number',
        type:'text'
    },
    {
        title:'开始时间',
        key:'c_date',
        type:'text'
    },{
        title:"时间",
        key:"c_time",
        type:'text'
    },
    {
        title:"状态",
        key:"c_state",
        type:'text'
    },{
        title:'教师签名',
        key:'tpicture',
        type: 'image',
        width: 120,
        height: 80
    }
  ]
 
const excelName = '实验室教师上课签名确认表' 
export default {
         data(){
             return{
                tableData:[]
             }
         },
           created(){
           console.log("我是token"+this.$store.state.token)
           axios1({
            url:"/excel/exportCourse",
            method:'get',
            headers: {
          // 'Content-Type': 'application/json',//设置请求头请求格式为JSON
            'token': this.$store.state.token //设置token 其中K名要和后端协调好
             },
             }).then((res)=>{this.tableData=res.data.data;console.log(res)}).catch((res)=>{console.log(res)})
        
            },

         methods:{
            butx(){
                 const data =this.tableData
	              console.log("导出数据函数")
                 table2excel(column, data, excelName)  
            },
            handleSizeChange(val) {
        console.log(`每页 ${val} 条`);
      },
      handleCurrentChange(val) {
        console.log(`当前页: ${val}`);
      }
         }
}
</script>

<style scoped>

</style>